<template>
  <el-dialog :title="title" width="80%" :visible.sync="visible">
    <el-form :inline="true">
      <el-form-item label="供应商编码：">
        <el-input v-model="recordInfo.queryForm.supplierOrganizationId" placeholder="输入供应商编码" clearable />
      </el-form-item>
      <el-form-item label="供应商名称：">
        <el-input v-model="recordInfo.queryForm.supplierOrganizationName" placeholder="输入供应商名称" clearable />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="getRecordList">搜索</el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="success" @click="determineClick">确认</el-button>
      </el-form-item>
    </el-form>
    <el-table
      ref="multipleTable"
      v-loading="recordInfo.loading"
      class="table-default"
      :data="recordInfo.list"
      border
      @selection-change="handleSelectionChange"
    >
      <el-table-column
        type="selection"
        width="43"
        fixed="left"
      />
      <el-table-column
        label="供应商编码"
        prop="supplierOrganizationId"
        fixed="left"
      />
      <el-table-column
        label="供应商名称"
        prop="organizationName"
      />
      <el-table-column
        label="供应商地址"
        prop="organizationAddress"
      />
    </el-table>
    <pagination
      v-show="recordInfo.total > 0"
      :total="recordInfo.total"
      :page.sync="recordInfo.queryForm.page"
      :limit.sync="recordInfo.queryForm.pageSize"
      @pagination="getRecordList"
    />
  </el-dialog>
</template>

<script>
import { mapGetters } from 'vuex'
import filters from '@/filters/index'
import ListMixin from '@/mixins/modules/list'
import permissionMixin from '@/mixins/modules/permission'
import Pagination from '@/components/Pagination'

export default {
  name: 'Popup',
  components: {
    Pagination
  },
  filters: { ...filters },
  mixins: [ListMixin, permissionMixin],
  data() {
    return {
      recordInfo: {
        queryForm: {
          page: 1,
          pageSize: 10,
          returnCount: true,
          orderBy: 'createTimeDesc',
          currentOrganizationIsPurchaser: true
        },
        requestUrl: this.$api.getSupplierList,
        list: [],
        total: 0
      },
      title: '选择供应商',
      visible: false,
      handleSelection: []
    }
  },
  computed: {
    ...mapGetters([
      'replenishParseTypeList',
      'purchaseOrderStateList'
    ])
  },
  methods: {
    childClick(e) {
      this.visible = true
    },
    handleSelectionChange(e) {
      this.handleSelection = e
    },
    determineClick() {
      if (this.handleSelection.length === 0) {
        this.$message({
          message: '请勾选供应商',
          type: 'warning'
        })
        return
      }
      this.visible = false
      this.$parent.fatherMethod(this.handleSelection)
      this.$refs.multipleTable.clearSelection()
    }
  }
}
</script>

<style scoped>

</style>
